<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>Hello MUI</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<link rel="stylesheet" href="../css/mui.min.css">
		<link rel="stylesheet" href="../style/fjol_style.css" />
	</head>

	<body>
		<!--下拉刷新容器-->
		
		<div id="pullrefresh" class="mui-content mui-scroll-wrapper">
			<div class="mui-scroll">
				<!--数据列表-->
				<ul class="mui-table-view" id="houseAgentList">
					<li class="mui-table-view-cell mui-media">
		                	<div class="mb10">
		                		<img src="../images/user-img.png" width="45" height="45" class="vm" />
		                		某某某
		                		<span class="mui-icon mui-icon-star f10 color02b260"></span>
		                		<span class="mui-icon mui-icon-star f10 color02b260"></span>
		                		<span class="mui-icon mui-icon-star f10 color02b260"></span>
		                		<span class="mui-icon mui-icon-star f10 color02b260"></span>
		                		<span class="mui-icon mui-icon-star f10 color02b260"></span>
		                	</div>
		                    <a href="javascript:;" class="mui-navigate-right">
		                        <img class="mui-pull-left mr5" width="100" height="80" src="http://placehold.it/120x100">
		                        <div class="mui-media-body">
		                            房源标题
		                            <div class="mui-ellipsis mui-clearfix mt10">
		                            	<span class="mui-badge mui-badge-success mui-badge-inverted f14 mui-pull-right">220万</span>
		                            	<div>
		                            		<p>
		                            			<span class="mr10">区域</span>
		                            			<span>小区名</span>
		                            		</p>
		                            		<p>3室2厅 150平方</p>
		                            	</div>
		                            </div>
		                            
		                        </div>
		                    </a>
	                            <div align="right" class="mt10">
	                            	<p class="change-agent">申请更换经纪人</p>
	                            	<a href="tel:12345678910">
	                            		<img src="../images/tophone.png" width="120" class="vm" />
	                            	</a>
	                            </div>
		                </li>
				</ul>
			</div>
		</div> 
		<script src="../js/mui.min.js"></script>
		<script src="../js/md5.js"></script>
		<script src="js/common.util.js"></script>
		<script src="../js/network.js"></script>
		<script src="../js/mui.pullToRefresh.js"></script>
		<script src="../js/mui.pullToRefresh.material.js"></script>
		<!--<script src="js/fj_public_js.js"></script>-->
		<script>
			mui.init({
				pullRefresh: {
					container: '#pullrefresh',
					down: {
						callback: pulldownRefresh
					},
					up: {
//						contentrefresh: '正在加载...',
						callback: pullupRefresh
					}
				}
			});
			
				var pageValue =1;
		/**
			 * 下拉刷新具体业务实现
			 */
			function pulldownRefresh() {
				setTimeout(function(){
					dataLoad(1,10);
					mui('#pullrefresh').pullRefresh().endPulldownToRefresh();
					return pageValue = 1;
				},1000);
				
			}	
			/**
			 * 上拉加载具体业务实现
			 */
			
			function pullupRefresh() {
				setTimeout(function() {

				var userInfo = common.myStorage.getItem('userInfo');
				pageValue++;
				var count;
//				console.log(pageValue);
					mui('#pullrefresh').pullRefresh().endPullupToRefresh((count==0));
				
					var param = [{
						key:'clientId',
						value:userInfo.clientId
					},{
						key:'page',
						value:pageValue
					},{
						key:'rows',
						value:10
					}];
					fjNetwork.get('fjzx/client/saleman-list.json',param,function(data){
//					console.log(JSON.stringify(data));
					var rows = data.rows;
					
					count = rows.length;
					mui('#pullrefresh').pullRefresh().endPullupToRefresh((rows.length==0)); //参数为true代表没有更多数据了。
					var collectHouseList = document.querySelector('#houseAgentList');
					var collectData = new Array();
					var rows = data.rows;
					
					
					for (i in rows) {
						var li = document.createElement('li');	//创建一个li标签
						li.className = 'mui-table-view-cell';	//设置class


						collectData.push('<div class="mb10">');
		                		collectData.push('<img src="../images/user-img.png" width="45" height="45" class="vm" />');
		                		collectData.push(rows[idx].realname);
		                		collectData.push('<span class="mui-icon mui-icon-star f10 color02b260"></span>');
		                		collectData.push('<span class="mui-icon mui-icon-star f10 color02b260"></span>');
		                		collectData.push('<span class="mui-icon mui-icon-star f10 color02b260"></span>');
		                		collectData.push('<span class="mui-icon mui-icon-star f10 color02b260"></span>');
		                		collectData.push('<span class="mui-icon mui-icon-star f10 color02b260"></span>');
		                	collectData.push('</div>');
		                    collectData.push('<a href="javascript:;" class="agentHouse mui-navigate-right" id="'+rows[idx].houseId+'">');
		                        collectData.push('<img class="mui-pull-left mr5" width="100" height="80" src="'+rows[idx].coverImage+'">');
		                        collectData.push('<div class="mui-media-body">');
		                            collectData.push(rows[idx].title);
		                            collectData.push('<div class="mui-ellipsis mui-clearfix mt10">');
		                            	collectData.push('<span class="mui-badge mui-badge-success mui-badge-inverted f14 mui-pull-right">'+parseInt(rows[idx].totalPrice/10000)+'万</span>');
		                            	collectData.push('<div>');
		                            		collectData.push('<p>');
		                            			collectData.push('<span class="mr10">'+rows[idx].area+'</span>');
		                            			collectData.push('<span>'+rows[idx].buildingName+'</span>');
		                            		collectData.push('</p>');
		                            		collectData.push('<p>'+rows[idx].bedRoomNumber+'室'+rows[idx].livingRoomNumber+'厅 '+rows[idx].square+'平方</p>');
		                            	collectData.push('</div>');
		                            collectData.push('</div>');
		                        collectData.push('</div>');
		                    collectData.push('</a>');
	                            collectData.push('<div align="right" class="mt10">');
	                            	collectData.push('<p class="change-agent mt5">申请更换经纪人</p>');
	                            	collectData.push('<a href="tel:'+rows[idx].mobile+'">');
	                            		collectData.push('<img src="../images/tophone.png" width="120" class="vm" />');
	                            	collectData.push('</a>');
	                            collectData.push('</div>');
					li.innerHTML = recommendArr.join('');
					recommendList.appendChild(li);
					}
					
				},function(msg){
					mui.toast(msg);
				});
				
				},1000);
			}
			mui.plusReady(function(){
				
			dataLoad(1,10);
				
				
			});
				function dataLoad(pageValue,rowsNumber){
					var userInfo = common.myStorage.getItem('userInfo');
					var param = [{
						key:'clientId',
						value:userInfo.clientId
					},{
						key:'page',
						value:pageValue
					},{
						key:'rows',
						value:10
					}];
					fjNetwork.get('fjzx/client/saleman-list.json',param,function(data){
//					console.log(JSON.stringify(data));
					var collectHouseList = document.querySelector('#houseAgentList');
					var collectData = new Array();
					var rows = data.rows;
					
					for (idx in rows) {

						collectData.push('<li class="mui-table-view-cell" id="">');

						collectData.push('<div class="mb10">');
		                		collectData.push('<img src="../images/user-img.png" width="45" height="45" class="vm" />');
		                		collectData.push(rows[idx].realname);
		                		collectData.push('<span class="mui-icon mui-icon-star f10 color02b260"></span>');
		                		collectData.push('<span class="mui-icon mui-icon-star f10 color02b260"></span>');
		                		collectData.push('<span class="mui-icon mui-icon-star f10 color02b260"></span>');
		                		collectData.push('<span class="mui-icon mui-icon-star f10 color02b260"></span>');
		                		collectData.push('<span class="mui-icon mui-icon-star f10 color02b260"></span>');
		                	collectData.push('</div>');
		                    collectData.push('<a href="javascript:;" class="agentHouse mui-navigate-right" id="'+rows[idx].houseId+'">');
		                        collectData.push('<img class="mui-pull-left mr5" width="100" height="80" src="'+rows[idx].coverImage+'">');
		                        collectData.push('<div class="mui-media-body">');
		                            collectData.push(rows[idx].title);
		                            collectData.push('<div class="mui-ellipsis mui-clearfix mt10">');
		                            	collectData.push('<span class="mui-badge mui-badge-success mui-badge-inverted f14 mui-pull-right">'+parseInt(rows[idx].totalPrice/10000)+'万</span>');
		                            	collectData.push('<div>');
		                            		collectData.push('<p>');
		                            			collectData.push('<span class="mr10">'+rows[idx].area+'</span>');
		                            			collectData.push('<span>'+rows[idx].buildingName+'</span>');
		                            		collectData.push('</p>');
		                            		collectData.push('<p>'+rows[idx].bedRoomNumber+'室'+rows[idx].livingRoomNumber+'厅 '+rows[idx].square+'平方</p>');
		                            	collectData.push('</div>');
		                            collectData.push('</div>');
		                        collectData.push('</div>');
		                    collectData.push('</a>');
	                            collectData.push('<div align="right" class="mt10">');
	                            	collectData.push('<p class="change-agent mr5">申请更换经纪人</p>');
	                            	collectData.push('<a href="tel:'+rows[idx].mobile+'">');
	                            		collectData.push('<img src="../images/tophone.png" width="120" class="vm" />');
	                            	collectData.push('</a>');
	                            collectData.push('</div>');
						
		                collectData.push('</li>');
					}
					
					collectHouseList.innerHTML = collectData.join('');

					
					mui('.change-agent').each(function(){
						this.addEventListener('tap',function(){
							mui.openWindowWithTitle({
								url:'change-agent.html',
								id:'change_agent',
								extras:{
									clientId:userInfo.clientId
								}
							},{
								title:{
									text:'更换经纪人'
								},
								back:{
									image:{
							            base64Data:''
							        }
								}
							})
						});
						
					});
				
				},function(msg){
					mui.toast(msg);
				});
				}
			
			Date.prototype.toLocaleString = function() {
		        return this.getFullYear() + "-" + (this.getMonth() + 1) + "-" + this.getDate() + " " + this.getHours() + ":" + this.getMinutes() + ":" + this.getSeconds();
		    };
			
		</script>
	</body>

</html>